Skill Level: Advanced

In this advanced lab you will learn how to build web widgets that are compatible with Industrial Graphics. A web widget is a small web component composed by self-contained code blocks that provides on-screen user interface elements. For example, using web widgets we can get access to the device camera, microphone, screen sharing, etc, through the MediaDevices Web API, we can leverage CSS animations, render 3D models with WebGL (you can use three.js library to make it easier) and many other web technologies, all from within System Platform or InTouch.

The lab will walk you through a use case of building an interactive chart web widget using the Highcharts JavaScript library and integrating it to System Platform.

We will be using HTML, CSS and JavaScript, prior knowledge of web development is recommended.